﻿

  <!-- /PAGE HEADER -->
  <!-- FORMS -->
  <div class="row">
      <div class="col-md-12">
          <div class="row">
              <div class="col-md-6">
                  <!-- BASIC -->
                  <div class="box border orange">
                      <div class="box-title">
                          <h4><i class="fa fa-bars"></i>角色添加</h4>
                          <div class="tools hidden-xs">
                              <a href="#box-config" data-toggle="modal" class="config">
                                  <i class="fa fa-cog"></i>
                              </a>
                              <a href="javascript:;" class="reload">
                                  <i class="fa fa-refresh"></i>
                              </a>
                              <a href="javascript:;" class="collapse">
                                  <i class="fa fa-chevron-up"></i>
                              </a>
                              <a href="javascript:;" class="remove">
                                  <i class="fa fa-times"></i>
                              </a>
                          </div>
                      </div>
                      <div class="box-body big">




                          <form class="form-horizontal" action="" method="post" role="form"  enctype="multipart/form-data">

                            <div class="form-group">
                              <label for="inputEmail3" class="col-sm-2 control-label" >角色名称</label>
                              <div class="col-sm-10">
                                <input type="text" name="name" class="form-control" id="inputEmail3" placeholder="请输入标题">
                              </div>
                            </div>


                            <div class="form-group">
                              <label for="inputEmail3" class="col-sm-2 control-label">是否启用</label>
                              <div class="col-md-8">
                         <label class="radio-inline"> <input type="radio" value="1"   class="uniform" name="state"> 是 </label>
                         <label class="radio-inline"> <input type="radio" checked="" value="0"   class="uniform" name="state"> 否 </label>

                       </div>
                            </div>

                            <div class="form-group">
                              <div class="col-sm-offset-2 col-sm-10">
                                <button type="submit" class="btn btn-pink">提交</button>
                              </div>
                            </div>

                          <div class="box border green">
                      <div class="box-title">
                        <h4><i class="fa fa-bars"></i>Form states
                        <input type="checkbox" class="quanx" name="checked">全选
                       </h4>
                    </div>


                        <div class="list">

                          <div class="checkbox">
                          <label>
                            <h4><input type="checkbox" value="1" class="xwquanx" name="power[]"> 新闻管理</h4>
                          </label>
                          </div>

                         <div class="fanx">
                            <input type="checkbox" value="2" class="uniform" name="power[]"> 新闻添加
                            <input type="checkbox" value="3" class="uniform" name="power[]"> 新闻删除
                            <input type="checkbox"  value="4" class="uniform" name="power[]"> 新闻修改
                         </div>
                    </div>
</div>
                      </div>



                          </form>

                      </div>
                  </div>
                  <!-- /BASIC -->
                  <!-- BASIC -->

<script src="resources/admin/js/jquery/jquery-2.0.3.min.js""></script>
<script type="text/javascript">
$(function(){
//     $('.list').on('change','select',function(){


//             //选中项id值
//          var id = $(this).val();
//            //删除当前操作之后的所有select标签

//          $(this).nextAll().remove();
//             //选中的是上一级则终止程序执行
//          if($(this).get(0).selectedIndex==0){
//                return false;
//          }

//          //通过ajax获取选中项的子级数据
//          $.ajax({
//             type:'get',
//             url:'index.php?c=cate&a=add&admin=1&id='+id,
//             dataType:'json',
//             success:function(json){
//   // alert(1);
//               //将程序返回子级的数据显示在下拉列表中
//               var html='';
//                 html+='<select class="form-control" name="pid">';
//                 html+='<option value="'+id+'">上一级</option>';

//                 for(i in json){
//                      html+='<option value="'+json[i].id+'">'+json[i].name+'</option>';
//                 }
//                 html+='</select>';

//                   //将新的下拉列表追加到原来的下拉列表后面
//                 $('.list').append(html);
//             }

//          })
//       })

  $('.box-title :checkbox').click(function(){
    // alert(123);
    //判断是否全部选中
    if($(this).prop('checked')){

       $('.list input').prop('checked',true);
     }else{
       $('.list input').prop('checked',false);
     }


  })

    //抓取checkbox（父级）这个类名的checkbox 绑定事件
 $('.checkbox :checkbox').click(function(){

    if($(this).prop('checked')){
      $(this).parent().parent().parent().next().find(':checkbox').prop('checked',true);
  }else{
      $(this).parent().parent().parent().next().find(':checkbox').prop('checked',false);
  }


 })
    //抓取fanx（父级）这个类名的checkbox 绑定事件
 $('.fanx :checkbox').click(function(){
    // alert(123);

   //当前操作 找它的父级的父级 搜索（find）xwquanx这个类名
    $(this).parent().parent().find('.xwquanx').prop('checked',true);

        })

})
</script>

